<div class="module invitations">					
	<h3 class="gradient dark">
		Your Invitations
	</h3>
	<div class="inner">
		<input type="button" id="send" value="Send Invitation" />
	</div>
	<div id="invitations_layer"style="display:none; background-color:#FFFFFF; padding: 10px;"> 
    	<div id="invitations_title">
    			<h3 class="gradient dark">
    				Invitations <a id="close_me" href="#" style="color:#253143;">Close</a>
            	</h3>
    	</div>
    	<? include_partial('invitations/inviteForm', array('form'=>$form)) ?>
    </div>
</div>
<script type="text/javascript">
	$(document).ready(function()
	{
	   	$("#invitations_layer").dialog({ 
	   		autoOpen: 	false,
	   		open:function() {
    			$(this).parents(".ui-dialog:first").find(".ui-dialog-titlebar-close").remove();
  			} 
	   	});
	   	
   		$('#send').click(function()
		{
			$("#invitations_layer").dialog("open");
		});
		
		$("#close_me").click(function() {
			$("#invitations_layer").dialog("close");	// close the dialog
			$('#invitations_form').remove();		// remove the form
			$('#invitations').load('<? echo url_for('invitations/loadform') ?>');	// reload the form
		});
	});
</script>
